<template>
  <div>
    <van-nav-bar left-arrow style="background: blue">
      <template #left>
        <van-icon name="arrow-left" color="#fff" size="20" @click="$router.push('/personalcenter')"/>
      </template>
      <template #title>
        <span style="color: #fff">个人信息</span>
      </template>
      <template #right>
        <van-icon name="wap-home-o" size="1.6rem" color="#fff" @click="$router.push('/about')"/>
      </template>
    </van-nav-bar>

    <div class="user">
      <van-field v-model="text" label="姓名" readonly input-align="right" />
      <van-field
        v-model="tel"
        type="tel"
        label="联系电话"
        readonly
        input-align="right"
      />
    </div>
    <div>
      <van-field v-model="sex" label="性别" readonly input-align="right" />
      <van-field
        v-model="yearmoney"
        label="年薪"
        readonly
        input-align="right"
      />
      <van-field v-model="monmoney" label="月薪" readonly input-align="right" />
      <van-field
        v-model="person"
        label="个人简介"
        readonly
        input-align="right"
      />
    </div>
  </div>
</template>

<script>
import { getPersonalCenterData } from "@/request/api";
export default {
  data() {
    return {
      text: "",
      tel: "",
      sex: "",
      yearmoney: "",
      monmoney: "",
      person: "",
    };
  },
  created() {
    getPersonalCenterData().then((res) => {
      if (res.errCode == 0) {
        console.log(res.data);
        this.text = res.data.name;
        this.tel = res.data.phone;
        this.sex = res.data.sex;
        this.yearmoney = res.data.year_salary;
        this.monmoney = res.data.month_salary;
        this.person = res.data.remark;
      }
    });
  },
};
</script>

<style scoped>
.user {
  margin: 0.8rem 0;
}
</style>